<!DOCTYPE html>
<html xmlns:h="http://xmlns.jcp.org/jsf/html" 
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <f:view>
        <f:metadata>
            <f:viewParam name="id" value="#{editPostBean.id}"/>
            <f:viewAction action="#{editPostBean.init()}"/>
        </f:metadata>
        <h:head>
            <title>Add Post</title>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        </h:head>
        <h:body>
            <h1>Add Post</h1>
            <h:form prependId="false">
                <h:panelGrid columns="2">
                    <h:outputLabel for="title">Title</h:outputLabel><h:inputText id="title" value="#{editPostBean.post.title}"/>
                    <h:outputLabel for="body">Content</h:outputLabel><h:inputTextarea id="body" value="#{editPostBean.post.body}" rows="5"/>
                    <h:outputLabel for="tags">Tags</h:outputLabel><h:selectManyCheckbox id="tags" value="#{editPostBean.post.tags}" >
                        <f:selectItems value="#{availableTags}" var="item" itemValue="#{item}"/>
                    </h:selectManyCheckbox>

                    <h:commandButton action="#{editPostBean.save}" value="Save"></h:commandButton>
                    <h:button outcome="posts.xhtml" value="Back to Post List"></h:button>
                </h:panelGrid>
            </h:form>
        </h:body>
    </f:view>
</html>
